<!-- MyInputCompWithLifecycle.vue -->
<template>
    <h2>I am {{ message }}</h2>
    <input
        ref="inputRef"
        v-model="message" type="text" placeholder="Enter your name"
    />
</template>

<script lang="ts" setup>
import { ref } from 'vue'

const inputRef = ref(null)
const message = ref("")

import { onUpdated, onMounted } from 'vue'

onMounted(() => {
    console.log('DOM instance: ', inputRef.value)
})

onUpdated(() => {
    console.log('DOM instance after updated: ', inputRef.value)
})

</script>
